<template>
  <view class="container">
	  
	  <uni-search-bar @confirm="search" :focus="true" :cancelButton="none" v-model="searchValue" @blur="blur" @focus="focus" @input="input"
	  				@cancel="cancel" @clear="clear">
	  </uni-search-bar>
	  
    <view class="tabs">
      <view
        v-for="(item, index) in tabs"
        :key="index"
        class="tab-item"
        :class="{ 'active': activeIndex === index }"
        @click="activeIndex = index">
        {{ item }}
      </view>
    </view>
    <view>
      <!-- 根据activeIndex的值来显示不同的内容 -->
      <view v-if="activeIndex === 0">
		   <view v-for="(row,index) in workList" :key="index" :id="row.id" >
			   <uni-card :is-shadow="false">
			   		<p >制单：{{row.workNo}} </p>
					<p >款号：{{row.styleNo}}</p>
			   		<p >交期：{{row.deliveryDate}}</p>
					<p >安排时间：{{row.time}}</p>
			   </uni-card>
		   </view>
	  </view>
      <view v-if="activeIndex === 1">
		  已安排内容table列表
	  </view>
    </view>
  </view>
</template>
 
<script>


export default {
  data() {
    return {
      tabs: ['待安排', '已安排'],
      activeIndex: 0, // 当前激活的tab索引
	  workList:[]
    };
  },
  methods: {
  			search(res) {
  				uni.showToast({
  					title: '搜索：' + res.value,
  					icon: 'none'
  				})
  			},
  			input(res) {
  				console.log('----input:', res)
  			},
  			clear(res) {
  				uni.showToast({
  					title: 'clear事件，清除值为：' + res.value,
  					icon: 'none'
  				})
  			},
  			blur(res) {
				// 失去焦点时发生 blur 事件
  				// uni.showToast({
  				// 	title: 'blur事件，输入值为：' + res.value,
  				// 	icon: 'none'
  				// })
  			},
  			focus(e) {
  			
  			},
  			cancel(res) {
  				uni.showToast({
  					title: '点击取消，输入值为：' + res.value,
  					icon: 'none'
  				})
  			}
  		},
	onBackPress() {
		// #ifdef APP-PLUS
		plus.key.hideSoftKeybord();
		// #endif
	},
	
	onLoad: function() {
		// 获取工号
		var userinfo=this.$queue.getData('userinfo');
		
		var data={
				proc_name:"PCA_GetAllowOpWorkList",
				method :"open_proc",
				db_name: 'kingzhizhu',
				params: [{
				    "name": "@companyId",
				    "value": "2020051121315254377"
				  }, {
				    "name": "@empId",
				    "value": userinfo.empId
				  },
				  {
				    "name": "@workLine",
				    "value": userinfo.workLine
				  }, 
				  {
				    "name": "@workNo",
				    "value": ""
				  },{
				    "name": "@type",
				    "value": 0
				  }
				  ]
			};
		
		this.$Request
			.post('/db/storedproc', data).then(res => {
	          console.log("res:",res);
			  let data= res.data
			  for(var i=0;i<data.length;i++){
				  var workData={};
				  workData.workNo=data[i][0]
				  workData.styleNo=data[i][1]
				  workData.styleName=data[i][2]
				  workData.deliveryDate=data[i][3]
				  if(workData.deliveryDate!=''){
					 workData.deliveryDate=workData.deliveryDate.substring(0,10) 
				  }
				  workData.time=data[i][4]
				  this.workList.push(workData);
			  }
		})
	}
		
};



</script>
 
<style>
.tabs {
  display: flex;
  justify-content: space-around;
}
.tab-item {
  padding: 10px;
  cursor: pointer;
}
.active {
  color: #fff;
  background-color: #007aff;
}


</style>